<template>
  <!-- PlayList组件左边内容区域 -->
  <div class="left_content">
    <PlayListDetail
      @add-all-song-to-music-list="addAllSongToMusicList"
    ></PlayListDetail>
    <SongItem @add-play-song="addPlaySong"></SongItem>
  </div>
</template>

<script>
import { defineComponent } from "vue";
import PlayListDetail from "@/components/playlistChild/PlayListDetail.vue";
import SongItem from "@/components/songitem/SongItem.vue";
export default defineComponent({
  name: "LeftContent",
  components: {
    PlayListDetail,
    SongItem,
  },
  setup(props, context) {
    let addPlaySong = (item) => {
      context.emit("addPlaySong", item);
    };
    let addAllSongToMusicList = () => {
      context.emit("addAllSongToMusicList");
    };
    return { addPlaySong, addAllSongToMusicList };
  },
});
</script>
<style scoped>
.left_content {
  flex: 1;
  padding: 20px;
  overflow: hidden;
}
</style>
